<form id="login" method="post" action="#"> 
<h1>Log in to your account!</h1>
<div>
<label for="login_user">Username</label> 
<input type="text" name="login_user" id="login_user" class="validate[required] text-input" title="Please provide your Username" />
</div>			
<div>
<label for="login_pwd">Password</label>
<input type="password" name="login_pwd" id="login_pwd" class="validate[required] text-input" title="Password is required" />
</div>			
<p class="forgot"><a href="#" id="forgotpass">Forgot your pwd?</a></p>
<div class="submit">
<button type="submit">Log in</button>     
</div>
</form>	
<!-- //#java script -->
<? foreach($js as $value): ?>
       <script type="text/javascript" src="<?=ASSET_URI.$value['src'] ?>"></script>
<? endforeach;?>
       <script type="text/javascript">
		$(document).ready(function() { 
			 var options = { 
				//target:        '#output2',   // target element(s) to be updated with server response 
				//beforeSubmit:  showRequest,  // pre-submit callback 
				success:       showResponse,  // post-submit callback 
		 
				// other available options: 
				url:       'check_user' ,       // override for form's 'action' attribute 
				type:      'post'  ,      // 'get' or 'post', override for form's 'method' attribute 
				dataType:  'json'  ,      // 'xml', 'script', or 'json' (expected server response type) 
				clearForm: true    ,    // clear all form fields after successful submit 
				//resetForm: true        // reset the form after successful submit 
		 
				// $.ajax options can be used here too, for example: 
				timeout:   3000 
			}; 
			jQuery("#login").validationEngine();
			jQuery('#login').ajaxForm(options); 
			
		}); 
		
		// post-submit callback 
		function showResponse(responseText, statusText, xhr, $form)  { 
			console.log(responseText);
			if(responseText.status=='FALSE'){
				alert(responseText.error );
			}else if(responseText.status=='TRUE'){
				location.reload();
			}
			 
		}
       </script>